import { useState } from 'react';
import { getAddressList } from '@/service/apis/mine';
import { View, Text, Button } from '@tarojs/components';
import Radio from '@/components/Radio';
import Taro, { useDidShow } from '@tarojs/taro';
import './style.scss';

/**
 * 地址管理
 * @returns
 */
const Address = () => {
  const [addressList, setAddressList] = useState([]);
  useDidShow(() => {
    getMyaddressList();
  });
  const getMyaddressList = async () => {
    const { user_address } = await getAddressList();
    setAddressList(user_address);
  };
  // 编辑地址
  const editAddress = (addressInfo?: any) => {
    Taro.navigateTo({
      url: `/subPages/address/addAddress/index?addressInfo=${JSON.stringify(addressInfo)}`,
    });
  };
  return (
    <View className="page-container">
      <View className="address-list-container">
        {addressList?.map((item: any, index) => (
          <View className="address-item" onClick={() => editAddress(item)} key={index}>
            <View className="left">
              <Radio checked={!!item.is_default} value={1} onChange={() => { }} />
              <View className="middle">
                <View className="user-info">
                  <Text className="user-name">{item.name}</Text>
                  <Text>{item.mobile}</Text>
                </View>
                <Text className="area-info">
                  {item.province_id}
                  {item.city_id}
                  {item.area_id}
                  {item.address}
                </Text>
              </View>
            </View>
            <View className="iconfont icon-edit" />
          </View>
        ))}
      </View>

      <Button onClick={() => editAddress()} className="add-address-btn">
        <Text className="iconfont icon-jiahao" />
        新增地点
      </Button>
    </View>
  );
};
export default Address;
